<template>
	<view class="box">
		<image class="mybackimg" src="http://assessgeek.oss-cn-hangzhou.aliyuncs.com/upload/20200728/e7cc0046fd76816035ea0497beb856cbdbb63fc5.png" mode="scaleToFill" style="width: 750rpx; height: 523rpx;"></image>
		<text class="my">我的</text>
		<view class="personal" v-if="url">
			<image :src="url" mode="scaleToFill" style="width: 110rpx; height: 110rpx;"></image>
			<text>{{uname}}</text>
		</view>

		<view class="login" v-else>
			<image src="/static/image/weidenglu.png" mode="scaleToFill" style="width: 110rpx; height: 110rpx;"></image>
			<button class="btn" hover-class='none' plain="true" open-type="getUserInfo" @getuserinfo="getOpenId">点击登录</button>
		</view>

		<view class="list">
			<view v-for="(item,index) in list" :key="item.id">
				<button v-if="index == 0" plain="true" @click="jump">{{item}} <text class="iconfont icon-jiantou"></text></button>
				<button v-if="index == 1 && telNumber === null" plain="true" open-type="getPhoneNumber" @getphonenumber="onGetPhoneNumber">{{item}}
					<text class="iconfont icon-jiantou"></text></button>
				<button v-if="index == 1 && telNumber !== null" plain="true" @click="jumpGetPhone">{{item}} <text class="iconfont icon-jiantou"></text></button>
			</view>
		</view>
	</view>
</template>

<script>
	import TIM from 'tim-wx-sdk';
	import WXBizDataCrypt from "@/common/WXBizDataCrypt.js";
	export default {
		onShow() {
			this.telNumber = this.$store.state.tel;
		},
		data() {
			return {
				actives: '1',
				path1: "../../homePage3/homePage3",
				backgroundColor: "transparent",
				url: null,
				uname: null,
				list: ["我的预约", "我的信息"],
				path: null,
				session_key: null,

				// 判断是否有电话号码，若有则不再获取电话了
				telNumber: null,
			};
		},
		methods: {
			jump(index) {
				if (!this.$store.state.userinfo) {
					uni.showToast({
						title: "请求点击登录"
					})
					return false;
				};
				uni.navigateTo({
					url: "../../appointment/appointment",
				});
			},
			logins() {
				this.personal = {
					url: "/static/image/touxian.png",
					uname: "张三"
				}
			},
			async getOpenId() {
				const selfs = this;
				uni.login({
					provider: 'weixin',
					success: (logins) => {
						uni.request({
							url: `https://chat.assessgeek.com/api/User/getCode?code=${logins.code}&type=1`,
							success: (res) => {
								this.$store.commit("storeSessionKey",res.data.session_key);
								this.session_key = res.data.session_key;
								uni.getUserInfo({
									provider: 'weixin',
									success: (infoRes) => {
										uni.request({
											method: "POST",
											url: "https://chat.assessgeek.com/api/User/getUser",
											data: {
												"openid": res.data.data,
												"nick_name": infoRes.userInfo.nickName,
												"avatar_url": infoRes.userInfo.avatarUrl
											},
											success: (userRes) => {
												selfs.url = userRes.data.data.avatar_url;
												selfs.uname = userRes.data.data.nick_name;

												selfs.$store.commit("storePersonalInformation", userRes.data.data);
												
												let nick = null;
												if (userRes.data.data.user_name == null) {
													nick = userRes.data.data.nick_name;
												} else {
													nick = userRes.data.data.user_name;
												};
												
												// 即时通讯的注册
												uni.request({
													url: `https://chat.assessgeek.com/api/Im/addIMUser?identifier=${res.data.data}&nick=${nick}&avatar_url=${infoRes.userInfo.avatarUrl}`,
													success(imMsg) {
														if (imMsg.data.data.ErrorCode == 0) {
															uni.request({
																url: `https://chat.assessgeek.com/api/Im/getUserSig?userid=${res.data.data}`,
																success(imsig) {
																	if (imsig.data.code == 200) {
																		selfs.$store.commit("storeImsig", imsig.data.data);
																		let options = {
																			SDKAppID: 1400388580
																		};
																		selfs.globalData.tim = TIM.create(options);
																		selfs.globalData.tim.setLogLevel(0);
																		let openid = selfs.$store.state.userinfo.openid;
																		let imsigs = imsig.data.data;
																		let loginPromise = selfs.globalData.tim.login({
																			userID: openid,
																			userSig: imsigs
																		}).then((imResponse) => {
																			if (imResponse.data.repeatLogin === true) {
																			}
																		}).catch((err) => {
																			console.error(err);
																		});
																		// ======================
																	}
																}
															});
														};
													}
												});

											},

										})
									}
								});

							}
						});
					}
				});
			},

			// 页面跳转
			jumpGetPhone() {
				uni.navigateTo({
					url: "../../myinfo/myinfo",
				});
			},

			// 获取手机号码
			onGetPhoneNumber(e) {
				if (!this.$store.state.userinfo) {
					uni.showToast({
						title: "请求点击登录"
					})
					return false;
				};

				if (e.detail.errMsg == "getPhoneNumber:fail user deny") {} else { //允许授权  
					uni.request({
						url: 'https://chat.assessgeek.com/api/User/getMobile',
						method: 'POST',
						data: {
							iv: e.detail.iv,
							encryptedData: e.detail.encryptedData,
							session_key: this.session_key,
						},
						success: (res) => {
							if (res.data.code == 200) {
								this.$store.commit("storeTel", res.data.data.phoneNumber)
								uni.navigateTo({
									url: "../../myinfo/myinfo",
								});
							};
						}
					});
				}
			},
			
		}
	}
</script>

<style lang="scss">
	.box {
		background-color: #F5F8FA;
	}

	.mybackimg {
		position: fixed;
		top: 0rpx;
		z-index: 3;
		left: 0;
	}

	.my {
		position: absolute;
		z-index: 100;
		top: 95rpx;
		left: 30rpx;
		color: #FFFFFF;
		font-size: 34rpx;
		font-family: PingFang SC;
		font-weight: 400;
	}

	.login {
		width: 100%;
		display: flex;
		align-items: center;
		position: absolute;
		z-index: 5;
		top: 207rpx;
		left: 0;
		padding-left: 30rpx;

		.btn {
			margin-left: 30rpx;
			display: inline-block;
			width: 195rpx;
			height: 70rpx;
			border-radius: 50rpx;
			@include shuipingchuijuzhong;
			font-size: 26rpx;
			font-family: PingFang SC;
			font-weight: 500;
			color: rgba(255, 255, 255, 1);
			border: 2rpx solid #FFFFFF !important;
		}
	}

	.personal {
		width: 100%;
		display: flex;
		align-items: center;
		position: absolute;
		z-index: 5;
		top: 207rpx;
		left: 0;
		padding-left: 30rpx;

		image {
			width: 110rpx;
			border-radius: 50%;
		}

		>text {
			margin-left: 30rpx;
			font-size: 32rpx;
			font-family: PingFang SC;
			font-weight: 500;
			color: rgba(255, 255, 255, 1);
		}
	}

	.list {
		width: 689rpx;
		border-radius: 20rpx;
		padding: 0rpx 40rpx;
		background-color: #FFFFFF;
		@include shuiping;
		z-index: 10;
		top: 375rpx;

		>view {
			height: 100rpx;
			line-height: 100rpx;

			button {
				@include chuizhilianduan;
				width: 100%;
				height: 100%;
				border: none;
				background-color: none;
				font-size: 28rpx;
				font-family: PingFang SC;
				font-weight: 400;
				color: rgba(0, 0, 0, 1);
				text-align: left;
			}

			&:first-of-type {
				border-bottom: 2rpx solid #EAEAEB;
			}

		}
	}
</style>
